<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<head>
    <style type="text/css">
        .select2-container .select2-selection--single {
            border: none;
            border-bottom: solid 1px #EEEEEE;
        }
    </style>

</head>
<body class="hold-transition skin-blue sidebar-mini">
<section class="content-header">
    <h1>下料工时确认单录入</h1>
</section>
<section class="content">
    <div class="row" style="margin-bottom: 24px">
        <a id="btn-save" href="javascript:void(0);"
           class="btn btn-info pull-right" style="margin-right: 10px"  shiro:hasPermission="cost:Blank:edit">
            <span class="Bold">确定</span>
        </a>
    </div>
    <div class="row">
        <form id="sheetForm" class="form-horizontal">
            <div class="col-xs-10 col-xs-offset-1">
                <div class="row">
                    <div class="form-inline">
                        <input type="hidden" id="sheetForm-proId" name="proId">
                        <input id="sheetForm-proCode" type="hidden" name="proCode">
                        <div class="form-group" style="margin-right: 13px;margin-left: 0px;">
                            <label>项目编号</label>
                            <select id="sheetForm-proCodeSelect" class="form-control"
                                    style="width:150px;"></select>
                        </div>
                        <div class="form-group" style="margin-right: 10px;">
                            <label>项目名称</label>
                            <input id="sheetForm-proName" type="text" name="proName" class="form-control text-center"
                                   style="border: none; border-bottom: solid 1px #EEEEEE;width:300px;background-color: white;"
                                   autocomplete="off" readonly>
                        </div>
                        <div class="form-group" style="margin-right: 10px;">
                            <label>项目数量</label>
                            <input id="sheetForm-proNum" type="text" name="proNum" class="form-control text-center"
                                   style="border: none; border-bottom: solid 1px #EEEEEE;width:100px;background-color: white;"
                                   autocomplete="off" readonly>
                        </div>
                        <div class="form-group" style="margin-right: 10px;">
                            <label>专业</label>
                            <select id="sheetForm-special" class="form-control" name="special"
                                    style="border: none; border-bottom: solid 1px #EEEEEE;width:100px;-webkit-appearance:none;">
                                <option value="">请选择</option>
                                <option value="机械">机械</option>
                                <option value="流体">流体</option>
                                <option value="自动化">自动化</option>
                                <!--<option value="外观">外观</option>-->
                            </select>
                        </div>
                        <div class="form-group" style="margin-right: 10px;">
                            <label>部分</label>
                            <select id="sheetForm-proPart" class="form-control" name="proPartId"
                                    style="border: none; border-bottom: solid 1px #EEEEEE;width:150px;-webkit-appearance:none;">
                                <option value="" selected>请选择</option>
                            </select>
                        </div>
                    </div>
                </div>
                <h4 style="margin-top: 60px;">人工工时</h4>
                <table class="t1 t3" id="hoursTable">
                    <thead>
                    <tr>
                        <td style="width: 10%">序号</td>
                        <td style="width: 23%">工时类别</td>
                        <td style="width: 16%">数量</td>
                        <td style="width: 16%">单位</td>
                        <td style="width: 25%">备注</td>
                        <td>
                            <!--<span class="out-add-h" title="添加"><i class="fa fa-plus text-info"></i> </span>-->
                            <!--<span class="out-del-h" title="删除"><i class="fa fa-remove text-red"></i> </span>-->
                        </td>
                    </tr>
                    </thead>
                    <tbody id="hours" >
                    <tr orderNum="orderNum">
                    <td beforeTdOrdernum="beforeTdOrdernum" >1</td>
                    <td>
                        <input type="text"  class="form-control" name="hDescribe" autocomplete="off">
                    </td>
                    <td>
                        <input type="number" step="0.1"  class="form-control" name="hQuantity" autocomplete="off">
                    </td>
                    <td>
                        <input type="text" class="form-control" name="hUnit" autocomplete="off" value="工日" readonly>
                    </td>
                    <td>
                        <input type="text" class="form-control" name="hRemark" autocomplete="off">
                    </td>
                    <td style="text-align:left;padding-left: 5px;">
                        <span class="out-add-h" title="添加"><i class="fa fa-plus text-info"></i> </span>
                        <span class="out-del-h" title="删除"><i class="fa fa-remove text-red"></i> </span>
                    </td>
                    </tr>
                    </tbody>
                </table>
                <h4 style="margin-top: 50px;">主要辅材用量</h4>
                <table class="t1 t3" id="weightTable">
                    <thead>
                    <tr>
                        <td style="width: 10%">序号</td>
                        <td style="width: 23%">主要辅材用量</td>
                        <td style="width: 16%">数量</td>
                        <td style="width: 16%">单位</td>
                        <td style="width: 25%">备注</td>
                        <td style="text-align:left;padding-left: 5px;"><span class="out-add-w" title="添加"><i class="fa fa-plus text-info"></i> </span></td>
                    </tr>
                    </thead>
                    <tbody id="weight">
                    <!--<td>1</td>-->
                    <!--<td>-->
                        <!--<select class="form-control" name="wDescribe">-->
                            <!--<option value="">请选择</option>-->
                            <!--<option th:each="r : ${weightType}" th:value="${r.name}"-->
                                    <!--th:text="${r.name}"></option>-->
                        <!--</select>-->
                    <!--</td>-->
                    <!--<td>-->
                        <!--<input  type="number" step="0.1"   class="form-control" name="wQuantity" autocomplete="off">-->
                    <!--</td>-->
                    <!--<td>-->
                        <!--<input type="text" class="form-control" name="wUnit" autocomplete="off">-->
                    <!--</td>-->
                    <!--<td>-->
                        <!--<input type="text" class="form-control" name="wRemark" autocomplete="off">-->
                    <!--</td>-->
                    <!--<td style="text-align:left;padding-left: 5px;">-->
                        <!--<span class="out-add-w" title="添加"><i class="fa fa-plus text-info"></i> </span>-->
                        <!--<span class="out-del-w" title="删除"><i class="fa fa-remove text-red"></i> </span>-->
                    <!--</td>-->
                    </tbody>
                </table>
            </div>
            <div class="col-xs-10 col-xs-offset-1" style="font-size: 14px;line-height: 200%;margin-top:10px;">
                <div class="col-xs-3" style="padding-left: 0">创建人： [[${session.user.name}]]</div>
            </div>
        </form>
    </div>
</section>
<!--<div id="div-makeTypeW" style="display: none">-->
    <!--<select class="form-control" name="wDescribe">-->
        <!--<option value="">请选择</option>-->
        <!--<option th:each="makeType : ${weightType}" th:value="${makeType.name}"-->
                <!--th:text="${makeType.name}"></option>-->
    <!--</select>-->
<!--</div>-->
<!--<div id="div-makeTypeH" style="display: none">-->
    <!--<select class="form-control" name="hDescribe">-->
        <!--<option value="">请选择</option>-->
        <!--<option th:each="makeType : ${hoursType}" th:value="${makeType.name}"-->
                <!--th:text="${makeType.name}"></option>-->
    <!--</select>-->
<!--</div>-->
<div th:include="include :: footer"></div>
<script th:inline="javascript">
    let dynamicIdH=0;
    let dynamicIdW=0;
    /** 计算表格序号 */
    function computerNoW() {
        $("table#weightTable tbody tr").each(function (i, e) {
            $(this).children("td:first").text(i + 1);
        });
    }
    /** 计算表格序号 */
    function computerNoH() {
        $("table#hoursTable tbody tr").each(function (i, e) {
            $(this).children("td:first").text(i + 1);
        });
    }
    /** tr表格变更后的序号的计算*/
    function beforeCompuTrNoH(){
        $("table#hoursTable  tr[orderNum='orderNum']").each(function(i,e){
            $(this).children("td[beforeTdOrdernum='beforeTdOrdernum']").text(i+1);
        })
    }
    /** tr表格变更后的序号的计算*/
    function beforeCompuTrNoW(){
        $("table#weightTable  tr[orderNum='orderNum']").each(function(i,e){
            $(this).children("td[beforeTdOrdernum='beforeTdOrdernum']").text(i+1);
        })
    }
    $(function () {
        let makeTypeH = $("#div-makeTypeH").html();
        let makeTypeW = $("#div-makeTypeW").html();
        /** 项目编号下拉框 */
        js.select2({
            id: 'sheetForm-proCodeSelect',
            placeholder: '',
            ajax: {
                url: function () {
                    return ctx + 'cost/dsnCost/project/list'
                },
                processResults: function (data, page) {
                    let array = data;
                    for (let i = 0; i < data.length; i++) {
                        array[i]["id"] = array[i]['id'];
                        array[i]["text"] = array[i]['code'];
                    }
                    return {results: array};
                },
            }
        });
        /** 项目编号下拉框选中 */
        $("#sheetForm-proCodeSelect").on("select2:select", function () {
            $("#sheetForm-proName").val($(this).select2("data")[0].name);
            $("#sheetForm-proNum").val($(this).select2("data")[0].num);
            $("#sheetForm-proId").val($(this).select2("data")[0].id);
            $("#sheetForm-proCode").val($(this).select2("data")[0].code);
            getPart();
        });
        //
        // js.validate.init("sheetForm", {
        //     fields: {
        //         proCode: {
        //             validators: {
        //                 threshold: 6, //有6字符以上才发送ajax请求，（input中输入一个字符，插件会向服务器发送一次，设置限制，6字符以上才开始）
        //                 notEmpty: {
        //                     message: '请输入8位项目编号'
        //                 },
        //                 // 发送ajax请求到后台查询，返回 valid：true或者false
        //                 callback: {
        //                     message: "项目号不存在",
        //                     callback: function (value, validator) {
        //                         var flag = false;
        //                         $.ajax({
        //                             url: ctx + 'cost/dsnCost/codeExist', // 请求路径
        //                             type: 'POST',
        //                             async: false,	// 同步请求，必须是false
        //                             data: {
        //                                 proCode: $('#sheetForm-proCode').val() // 请求参数
        //                             },
        //                             success: function (res) {
        //                                 flag = $.parseJSON(res).valid;
        //                             }
        //                         });
        //                         return flag;
        //                     }
        //                 }
        //             }
        //         },
        //         specialId: {validators: {notEmpty: {message: '请选择专业'}}},
        //         proPartId: {validators: {notEmpty: {message: '请选择部分'}}}
        //     }
        // });
        // /** 项目编号 焦点离开 自动取得相关信息 */
        // $("#sheetForm-proCode").blur(function () {
        //     js.get({
        //         url: ctx + "cost/dsnCost/project",
        //         data: {proCode: $("#sheetForm-proCode").val()},
        //         success: function (result) {
        //             if (result.length == 0) {
        //                 $("#sheetForm-proName").val("");
        //                 $("#sheetForm-proNum").val("");
        //                 $("#sheetForm-proId").val("");
        //             } else {
        //                 $("#sheetForm-proName").val(result[0].name);
        //                 $("#sheetForm-proNum").val(result[0].num);
        //                 $("#sheetForm-proId").val(result[0].id);
        //             }
        //         }
        //     });
        // });


        $("#sheetForm-proCode").change(function () {
            getPart();
        })

        $("#sheetForm-special").change(function () {
            getPart();
        })

        /** 添加一行 人工工时*/
        $("#sheetForm").on('click', '.out-add-h', function () {
            $(this).parents("tr").after(`
                    <tr orderNum="orderNum">
                        <td beforeTdOrdernum="beforeTdOrdernum">1</td>
                        <td>
                              <input type="text" class="form-control" name="hDescribe" autocomplete="off">
                        </td>
                         <td>
                            <input type="number" step="0.1"  class="form-control" name="hQuantity" autocomplete="off">
                        </td>
                        <td>
                            <input type="text" class="form-control" name="hUnit" autocomplete="off" value="工日" readonly>
                        </td>
                        <td>
                            <input type="text" class="form-control" name="hRemark" autocomplete="off">
                        </td>
                        <td style="text-align:left;padding-left: 5px;">
                            <span class="out-add-h" title="添加"><i class="fa fa-plus text-info"></i> </span>
                            <span class="out-del-h" title="删除"><i class="fa fa-remove text-red"></i> </span>
                    </td>
                    </tr>
            `);
            beforeCompuTrNoH();
            // computerNoH();
        });

        /** 添加一行 主要辅材用量*/
        $("#sheetForm").on('click', '.out-add-w', function () {
            $("#weight").after(`
                    <tr orderNum="orderNum">
                        <td beforeTdOrdernum="beforeTdOrdernum">1</td>
                        <td>
                             <input type="text" class="form-control" name="wDescribe" autocomplete="off">
                        </td>
                         <td>
                            <input type="number" step="0.1"  class="form-control" name="wQuantity" autocomplete="off">
                        </td>
                        <td>
                            <input type="text" class="form-control" name="wUnit" autocomplete="off">
                        </td>
                        <td>
                            <input type="text" class="form-control" name="wRemark" autocomplete="off">
                        </td>
                        <td style="text-align:left;padding-left: 5px;">
                            <!--<span class="out-add-w" title="添加"><i class="fa fa-plus text-info"></i> </span>-->
                            <span class="out-del-w" title="删除"><i class="fa fa-remove text-red"></i> </span>
                    </td>
                    </tr>
            `);
            beforeCompuTrNoW();
        });
        /** 删除行 人工工时*/
        $('#sheetForm').on('click', '.out-del-h', function () {
            $(this).parents("tr").remove();
            if ($("table#hoursTable tbody tr").length === 0) {
                $("#hours").append(`
                    <tr orderNum="orderNum">
                        <td beforeTdOrdernum="beforeTdOrdernum">1</td>
                        <td>
                              <input type="text" class="form-control" name="hDescribe" autocomplete="off">
                        </td>
                         <td>
                            <input type="number" step="0.1"  class="form-control" name="hQuantity" autocomplete="off">
                        </td>
                        <td>
                            <input type="text" class="form-control" name="hUnit" autocomplete="off" value="工日" readonly>
                        </td>
                        <td>
                            <input type="text" class="form-control" name="hRemark" autocomplete="off">
                        </td>
                        <td style="text-align:left;padding-left: 5px;">
                            <span class="out-add-h" title="添加"><i class="fa fa-plus text-info"></i> </span>
                            <span class="out-del-h" title="删除"><i class="fa fa-remove text-red"></i> </span>
                    </td>
                    </tr>
            `);
            }

            beforeCompuTrNoH();
            // computerNoH();
        });
        /** 删除行 主要辅材用量*/
        $('#sheetForm').on('click', '.out-del-w', function () {
            $(this).parents("tr").remove();
            beforeCompuTrNoW();
        });

        /** 保存计划单 */
        $("#btn-save").click(function () {
            debugger
            let $this = $(this);
            let res = js.vd({
                id: 'sheetForm',
                notEmpty: ['proCode', 'special', 'proPartId', 'wQuantity', 'wUnit', 'wDescribe','hQuantity', 'hUnit', 'hDescribe']
            })
            if (!res) {
                js.modal.warning("请将数据填写完整！！")
                return;
            }
            $this.attr('disabled', true);
            js.submit({
                formId: "sheetForm",
                url: ctx + 'craft/cost/blanking/save',
                data: new FormData($("#sheetForm")[0]),
                success: function (result) {
                    debugger;
                    if (result.type === web_status.SUCCESS) {
                        if(result.data===-2){
                            alert(result.msg);
                            return;
                        }else if(result.data===-1) {
                            js.modal.success(result.msg);
                        }else {
                            myFunction();

                        }
                    } else {
                        js.modal.warning(result.msg);
                    }
                }
            });
            $this.removeAttr('disabled');
        });

    });

    /** 获取部分 */
    function getPart() {
        let code = $("#sheetForm-proCode").val();
        let type = $("#sheetForm-special").val();
        switch (type) {
            case '机械' :
            case '流体' :
            case '自动化' :
                fetchPart(code, type);
                break;
            case '外观' :
                fetchPart(code, null);
                break;
        }
    }

    function fetchPart(code, type) {
        js.get({
            url: ctx + 'tecout/tecnote/part/list',
            data: {
                code : code,
                type : type
            },
            success: function (result) {
                $("#sheetForm-proPart").empty().append(`<option value="">请选择</option>`);
                result.forEach(value => {
                    if (value) {
                        $("#sheetForm-proPart").append(`<option value="${value.id}">${value.special}-${value.proPart}</option>`);
                    }
                })
            }
        })
    }
    /** 在固定的td里面填充select*/
    function additional(){
        var weightTypeArry =  JSON.parse(sessionStorage.getItem("weightTypeList"));
        $("#desc"+dynamicId).append(`<option value="">请选择</option>`);
        weightTypeArry.forEach(value => {
            if (value) {
                $("#desc"+dynamicId).append(`<option value="${value.name}">${value.name}</option>`);
            }
        })
    }
    function myFunction(){
        var x;
        var r=confirm("保存成功 ！！是否留在当前页面继续录入！！ "+"\n"+"确定：留在当前页面继续录入！！  "+"\n"+"取消：跳转提交页面!");
        if (r==true){
            location.href = ctx + "craft/cost/blanking/create";
        }
        else{
            location.href = ctx + "craft/cost/blanking/submit";
        }
    }
</script>
</body>
</html>
